<script setup lang="ts">
import { ref } from "vue";
import { formRules } from "./utils/rule";
import { FormProps } from "./utils/types";
import ReCol from "@/components/ReCol";
const props = withDefaults(defineProps<FormProps>(), {
  formInline: () => ({
    title: "新增",
    code: "",
    name: "",
    customerId: 0,
    contactName: "",
    contactPhone: null,
    email: "",
    address: "",
  })
});
const statusOptions = [
  {
    value: 1,
    label: "启用"
  },
  {
    value: 2,
    label: "禁用"
  }
];
const ruleFormRef = ref();
const newFormInline = ref(props.formInline);

function getRef() {
  return ruleFormRef.value;
}
defineExpose({ getRef });
</script>

<template>
  <el-form
    ref="ruleFormRef"
    :model="newFormInline"
    :rules="formRules"
    label-width="auto"
  >
    <el-row :gutter="30">
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item label="客户编码" prop="code">
          <el-input
            v-model="newFormInline.code"
            clearable
			disabled
            placeholder="请输入客户编码"
			:maxlength="30"
          />
        </el-form-item>
      </re-col>
	  <re-col :value="12" :xs="24" :sm="24">
	    <el-form-item label="客户名称" prop="name">
	      <el-input
	        v-model="newFormInline.name"
	        clearable
	        placeholder="请输入客户名称"
			:maxlength="15"
	      />
	    </el-form-item>
	  </re-col>
      <re-col :value="12" :xs="24" :sm="24">
        <el-form-item label="客户地址" prop="address">
          <el-input
            v-model="newFormInline.address"
            clearable
            placeholder="请输入客户地址"
			:maxlength="50"
          />
        </el-form-item>
      </re-col>
	  <re-col :value="12" :xs="24" :sm="24">
	    <el-form-item label="联系人姓名" prop="contactName">
	      <el-input
	        v-model="newFormInline.contactName"
	        clearable
	        placeholder="请输入联系人姓名"
			:maxlength="15"
	      />
	    </el-form-item>
	  </re-col>
	  <re-col :value="12" :xs="24" :sm="24">
	    <el-form-item label="联系人手机" prop="contactPhone">
	      <el-input
	        v-model="newFormInline.contactPhone"
	        clearable
	        placeholder="请输入联系人手机"
			type="number"
			class="no_number"
			oninput="if(value.length>11)value=value.slice(0,11)"
	      />
	    </el-form-item>
	  </re-col>
	  <re-col :value="12" :xs="24" :sm="24">
	    <el-form-item label="电子邮箱">
	      <el-input
	        v-model="newFormInline.email"
	        clearable
	        placeholder="请输入电子邮箱"
			:maxlength="30"
	      />
	    </el-form-item>
	  </re-col>
    </el-row>
  </el-form>
</template>
<style scoped></style>
